@include b(color-picker) {
  color: getCssVar(form-item, text-color);

  // 颜色选择框样式
  .el-color-picker__trigger {
    border: none;
  }

  @include b(color-picker-content){
    display: inline-block;
    padding: getCssVar('spacing', 'extra-tight') getCssVar(spacing, tight);
    font-size: getCssVar(form-item, font-size);
    border: 1px solid getCssVar(editor, default, border-color);
    border-radius: getCssVar(border, radius, small);    

    &:hover{
      border: 1px solid getCssVar(editor, hover, border-color);
    }
  }

  @include b(color-picker-text){
    margin-left: getCssVar(spacing, super-tight);
  }

  // 只读模式显示
  @include m(readonly) {
    font-size: getCssVar(form-item, font-size);
    line-height: getCssVar(editor, default, line-height);
    color: getCssVar(form-item, readonly-color);

    @include overflow-wrap;
  }
}

@include b(form-item){

  @include b(color-picker) {
    @include when(show-default){
      padding: getCssVar(form-item, hover-edit-padding);
    }
  }
}